import Vue from 'vue'  // 引入vue框架
import App from './App.vue' // 页面入口文件（.vue后缀的文件都称为组件）

Vue.config.productionTip = false

// 路由的是使用
// 1、下载vue-router , npm i vue-router
// 2、引入路由
import VueRouter from "vue-router";
// 3、注册全局组件
Vue.use(VueRouter);
// 4、创建路由规则数组
const routes = [
  {
    path: "/find", // 定义访问路径
    component: ()=>import("./views/find.vue") // 这种通过函数的方法引入组件，路由的按需引入
  },{
    path: "/my/:age",
    component: ()=>import("./views/my.vue")
  },
  {
    path: "/friend",
    component: ()=>import("./views/friend.vue")
  }
]
// 5、 用路由规则生成路由对象
const router = new VueRouter({
  routes: routes
})
new Vue({
  router: router, // 6、把路由对象注入到new Vue中
  render: h => h(App),
}).$mount('#app') // $mount挂载，表示渲染的内容将来要替换到id为app的标签位置上
// 7、在App.vue组件设置路由挂载点 router-view